<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>演示js发起ajax请求得到json数据</title>
	</head>
	<body>
		<script type="text/javascript">
			function loadName(url, func){
				var xmlHttp = null;
				//判断浏览器是否优先支持XMLHttpRequest
				if(window.XMLHttpRequest){
					xmlHttp = new XMLHttpRequest();
				}else{
					//让IE老版本使用也可以使用Ajax
					xmlHttp = new ActiveXObject("Microsoft.XMLHttpRequest");
				}
				//默认状态
				//alert("ready状态："+xmlHttp.readyState+";"+"status状态："+xmlHttp.status);  0    0 
				//请求状态，请求分为四种状态
				//onreadystatechange  是存储函数，党readyState的状态改变就会调用这个onreadystatechange函数
				xmlHttp.onreadystatechange=function(){
					//请求进行状态
					//readyState有四种状态  
					// 0代表请求正在初始化  
					 // 1与服务器建立请求成功   
					  // 2代表服务器接受请求    
					  //3 代表服务器请求处理中      
					// 4 代表请求完成，响应已就绪
				    if(xmlHttp.readyState==4 && xmlHttp.status==200){        //status   200 代表服务器响应内容状态OK   404代表服务器响应内容没找到
						//alert("ready状态："+xmlHttp.readyState+";"+"status状态："+xmlHttp.status);
						console.log(xmlHttp.responseText);            //测试返回到的数据
		                var dataObj = JSON.parse(xmlHttp.responseText);       //将服务器返回的Json对象转换为JS对象
						
						func(dataObj);
						
					}
				}
				//get方式提交
				xmlHttp.open("get", url,true);
				xmlHttp.send();
				//post方式提交, 
				// 第一个参数为方法
				// 第二个参数为url
				// 第三个参数为是否异步请求，true为是。false为否
//				xmlHttp.open("post", "film.json", true);
//				xmlHttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");    //表示按照表格post的方式提交
//				xmlHttp.send("name=jack&age=11");
			} 
			loadName("film.json?name=mawanlin&age=12", handleAjaxResult);
			
			// 声明一个函数用于处理ajax请求的结果
			function handleAjaxResult(obj){
				
				// 读取的数据中使用了RECORDS作为数据的name
				var results = obj.RECORDS;
				for(var i=0; i<results.length; i++){
					var film = results[i];
					document.write("电影id=" + film.film_id +",电影标题是:" + film.title + "<br />")
					document.write("简介：" + film.description +"<br />");
					document.write("发行时间:"+ film.release_year + "<br />");
					document.write("<hr />")
				}
			}
		</script>
	</body>
</html>
